<!--
  ~ This program is part of the OpenLMIS logistics management information system platform software.
  ~ Copyright © 2013 VillageReach
  ~
  ~ This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
  ~  
  ~ This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details.
  ~ You should have received a copy of the GNU Affero General Public License along with this program.  If not, see http://www.gnu.org/licenses.  For additional information contact info@OpenLMIS.org. 
  -->

<div class="init-rnr">
  <h2 openlmis-message="label.initiate.requisition"></h2>

  <br>

  <div class="row-fluid">
    <div class="span12">
      <label openlmis-message="label.requisition.facilityType"></label>
    </div>
  </div>

  <div class="row-fluid">
    <div class="span2 form-inline">
      <input id="myFacilityRnr" type="radio" ng-model="selectedType"
             value="0" ng-checked="selectedType==0"
             ng-change="loadFacilityData(selectedType);"/>
      &nbsp;<label for="myFacilityRnr"><strong
      openlmis-message="label.myFacility"></strong></label>
    </div>
    <div class="span4 form-inline">
      <input id="supervisedFacilityRnr" type="radio"
             ng-model="selectedType" value="1"
             ng-checked="selectedType==1"
             ng-change="loadFacilityData(selectedType);"/>
      &nbsp;<label for="supervisedFacilityRnr"><strong
      openlmis-message="label.supervised.Facility"></strong></label>
    </div>
  </div>

  <br>

  <div ng-show="selectedType == 0">
    <div class="row-fluid">
      <div class="span12">
        <label openlmis-message="label.requisition.facilityName"></label>
      </div>
    </div>
    <div class="row-fluid">
      <input type="text" class="span3" ng-model="facilityDisplayName"
             readonly="readonly"/>
    </div>

    <br/>

    <div class="row-fluid">
      <div class="span12">
        <label openlmis-message="label.program"></label>
      </div>
    </div>
    <div class="row-fluid">
      <select ui-select2 placeholder="{{ programOptionMessage() }}"
              id="programListMyFacility" class="span3"
              ng-model="selectedProgram.id" ng-change="loadPeriods()">
        <option value=""></option>
        <option ng-repeat="program in programs | orderBy: 'name'"
                value="{{ program.id }}">{{ program.name }}
        </option>
      </select>
    </div>

  </div>


  <div ng-show="selectedType == 1">
    <div class="row-fluid">
      <div class="span12">
        <label openlmis-message="label.program"></label>
      </div>
    </div>
    <div class="row-fluid">
      <select ui-select2 placeholder="{{ programOptionMessage() }}"
              class="span3" id="programListSupervisedFacility"
              ng-change="loadFacilitiesForProgram();"
              ng-model="selectedProgram.id">
        <option value=""></option>
        <option ng-repeat="program in programs | orderBy: 'name'"
                value="{{ program.id }}">{{ program.name }}
        </option>
      </select>
    </div>

    <br/>

    <div class="row-fluid">
      <div class="span12">
        <label openlmis-message="label.requisition.facilityName"></label>
      </div>
    </div>
    <div class="row-fluid">
      <select ui-select2 placeholder="{{ facilityOptionMessage() }}"
              class="span3" id="facilityList" ng-change="loadPeriods()"
              ng-model="selectedFacilityId">
        <option value=""></option>
        <option ng-repeat="facility in facilities | orderBy : 'name'"
                value="{{ facility.id }}">{{ facility.code }} - {{
          facility.name }}
        </option>
      </select>
    </div>

  </div>

  <br/>

  <div class="row-fluid">
    <div class="span12">
      <label openlmis-message="label.requisition.type"></label>
    </div>
  </div>
  <div class="row-fluid">
    <select id="rnrType" class="span3" ng-model="selectedRnrType.emergency"
            ng-options="i.emergency as i.name for i in rnrTypes.types"
            ng-change="loadPeriods()">
    </select>
  </div>

  <div class="row-fluid init-rnr-grid" ng-show="selectedProgram && selectedFacilityId && !(periodGridData.length == 0)">
    <div class="span6">
      <div class="gridStyle small" ng-grid="periodGridOptions"
           ng-show="selectedProgram && selectedFacilityId && !(periodGridData.length == 0)"></div>
    </div>
  </div>
  <div class="row-fluid" ng-show="error">
    <div class="span12">
      <div class="alert alert-error" id="saveSuccessMsgDiv"
           openlmis-message="error" ng-show="error"></div>
    </div>
  </div>
</div>